<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap-theme.css.map"/>
    <link rel="stylesheet" type="text/css" href="../css/dashboard.css"/>
    <script src="../script/jquery-1.11.3.js"></script>
    <script src="../ckeditor/ckeditor.js"></script>
    <script src="../bootstrap/js/bootstrap.min.js"></script>
    <script>
    	$(function(){
    		/* $("#foodTypeList>option:first-of-type").attr("selected",true);
    		
    		$("select").change(function(){
    			$(".rateTr").empty();
    			$.getJSON("GetRateByFoodTypeIdServelt.html",{foodType:$(this).val()},function(json){
    				$(".rateTr").empty();
    				for(var i=0;i<json.length;i++){
    					$(".rateTr").append("<label class='ras' data-ref='"+json[i].fsId+"'>"+json[i].foodSizeName+"</label>"+
    										"<input class='ycy-ratioInfo' type='number' data-ref='"+json[i].fsId+"'/>&nbsp;&nbsp;");
    				}
    			}); 
    		});
    		
    		/* 保存按钮 */
    		/* $("#saveAddFood").click(function(){
    			if($("#foodTypeList>option:selected").val()==-1){
    				alert("请选择一种食物类型");
    				return false;
    			}
				
    			var arrInfo=new Array();
    			var index=0;
    			 $(".ras").each(function(){
    				var rateId=$(this).attr("data-ref");
    				$(".ycy-ratioInfo").each(function(){
    					if(rateId==$(this).attr("data-ref")){
    						var ratioCount=$(this).val();
    						arrInfo[index]={rate:rateId,ratio:ratioCount};
    					}
        			});  
    				index++;
    			}); 
    			for(var i = 0;i<arrInfo.length;i++){
    				$(".ycy-ratio-size"+(i*1+1)).attr("name",arrInfo[i].rate);
    				$(".ycy-ratio-size"+(i*1+1)).attr("value",arrInfo[i].ratio);
    			}
    			
    			return false;
    		});  */
    		$("select").change(function(){
    			$(".rateTr").empty();
    			if($(this).val()==1){
    				$(".rateTr").append("<label class='ras'>8寸</label><input name='small' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>12寸</label><input name='middle' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>20寸</label><input name='big' type='number' />&nbsp;&nbsp;")
    			}else if($(this).val()==2){
    				$(".rateTr").append("<label class='ras'>小份</label><input name='small' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>中份</label><input name='middle'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>大份</label><input name='big'  type='number' />&nbsp;&nbsp;")
    			}else if($(this).val()==3){
    				$(".rateTr").append("<label class='ras'>小份</label><input name='small'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>中份</label><input  name='middle' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>大份</label><input  name='big' type='number' />&nbsp;&nbsp;")
    			}else if($(this).val()==4){
    				$(".rateTr").append("<label class='ras'>小份</label><input name='small' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>中份</label><input name='middle' type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>大份</label><input name='big' type='number' />&nbsp;&nbsp;")
    			}else if($(this).val()==5){
    				$(".rateTr").append("<label class='ras'>双人餐</label><input name='small'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>三人餐</label><input name='middle'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>四人餐</label><input name='big'  type='number' />&nbsp;&nbsp;")
    			}else if($(this).val()==6){
    				$(".rateTr").append("<label class='ras'>小杯</label><input name='small'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>中杯</label><input name='middle'  type='number' />&nbsp;&nbsp;")
    				.append("<label class='ras'>大杯</label><input name='big'  type='number' />&nbsp;&nbsp;")
    			}
    		})
    	});
    </script>
    <style>
    	 .itemTd{
    	 	text-align: right;
    	 }
    	 input[type=number] {
    	 	width:50px;
    	 }
    	 td{
    	 	margin-top:20px;
    	 }
    	 .ras{
    	 	width:50px;
    	 	text-align: left;
    	 }
    </style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">
        <div class="navbar-header">
            <button class="navbar-toggle collapsed" aria-expanded="false" aria-controls="navbar" type="button" data-toggle="collapse" data-target="#navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">LazyEgg-后台管理</a>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <c:import url="/admin/adminShare.jsp" />
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <h2 class="sub-header">食物上新</h2>
            <form action="AdminFoodAddServlet.html" enctype="multipart/form-data" method="post">
            		<input type="hidden" class="ycy-ratio-size1"/>
            		<input type="hidden" class="ycy-ratio-size2"/>
            		<input type="hidden" class="ycy-ratio-size3"/>
                    <table class="tbFoods">
                        <tr>
                            <td class="itemTd">食物名称：</td>
                            <td><input name="foodName" type="text" value="${food.foodName}"/></td>
                        </tr>
                        <tr>
                            <td class="itemTd">食物类型：</td>
                            <td>
								<select name="foodTypeSelect" id="foodTypeList">
									<option value="-1">请选择</option>
									<c:forEach var="foodType" items="${allFoodType}">
										<c:choose>
											<c:when test="${foodType.ftId==ftId}">
												<option value="${foodType.ftId}" selected="selected">${foodType.foodTypeName}</option>
											</c:when>
											<c:otherwise>
												<option value="${foodType.ftId}">${foodType.foodTypeName}</option>
											</c:otherwise>
										</c:choose>
									</c:forEach>
								</select>
							</td>
                        </tr>
                        
                        <tr>
                        	<td class="itemTd">食物价格：</td>
                        	<td>￥<input name="foodPrice" type="number" value="${food.foodprice}"/></td>
                        </tr>
                        <tr>
                        	<td class="itemTd">份量价格比率：</td>
                        	<td class="rateTr">
                        		<label class="ras">8寸</label><input name="small" type="number" />&nbsp;&nbsp;
                        		<label class="ras">12寸</label><input name="middle" type="number" />&nbsp;&nbsp;
                        		<label class="ras">20寸</label><input name="big" type="number" />&nbsp;&nbsp;
                        	</td>
                        	
                        </tr>
                        <tr>
                            <td class="itemTd">食物详情：</td>
                            <td class="foodsDesc"><textarea name="foodDesc" class="ckeditor">${food.description}</textarea></td></td>
                        </tr>
                        <tr>
                            <td class="itemTd">图片路径：</td>
                            <td class="foodsDesc"><input name="imgPath" type="file" class="ckeditor"/></td></td>
                        </tr>
                        <tr><td></td>
                            <td><input type="submit" value="保存" id="saveAddFood"/><input type="reset" value="取消"/></td>
                        </tr>
                    </table>
            </form>
        </div>
    </div>
</div>
</body>
</html>